<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
</head>

<body>
    <h2>分析user数组和x数组的不同</h2>
    <h3 id="test1"></h3>
    <h3 id="test2"></h3>
    <h3>发现两个数组是一样的 说明x不是user的副本 是同一个对象</h3>
    <h2>对象构造函数</h2>
    <h2>new Object()</h2>
    <h3 id="test3"></h3>
    <h2>函数构造</h2>
    <h3 id="test4">
        <hr>
        <h3 id="t1"></h3>
        <h3 id="t2"></h3>
        <h3 id="t3"></h3>
        <h3 id="t4"></h3>
        <script>
            //之前讲过一些对象 这里不再重复 主要讲一些没写过的
            var user = {
                firstName: "维沙尔",
                lastName: "乔达里",
                age: 22,
                location: "新德里",
            };
            var x = user;
            x["firstName"] = "丛雨";
            document.getElementById("test1").innerHTML =
                user.firstName +
                "-" +
                user.lastName +
                "-" +
                user.age +
                "-" +
                user.location;
            document.getElementById("test2").innerHTML =
                x.firstName + "-" + x.lastName + "-" + x.age + "-" + x.location;
            //对象构造函数
            var y = new Object();
            y.firstName = "维沙尔";
            y.lastName = "乔达里";
            y.age = 22;
            y.location = "新德里";

            y["firstName"] = "你好";
            document.getElementById("test3").innerHTML =
                y.firstName + "-" + y.lastName + "-" + y.age + "-" + y.location;
            //使用构造函数

            function User(fname, lname, age, loc) {
                this.firstName = fname;
                this.lastName = lname;
                this.age = age;
                this.location = loc;
            }
            var z = new User("乔尼", "乔斯达", 22, "DIO");
            document.getElementById("test4").innerHTML =
                z.firstName + "-" + z.lastName + "-" + z.age + "-" + z.location;

            //接下来是对象属性

            //访问方法
            document.getElementById("t1").innerHTML = x.firstName + "-" + x["lastName"];
            //添加新属性
            z.friend = "普奇神父";
            document.getElementById("t2").innerHTML = z.friend;
            //修改上面提到过 不写了
            //删除
            delete z.friend;
            document.getElementById("t3").innerHTML = z.friend;
            //遍历
            for (let p in z) {
                document.write(z[p] + "<br>");
            }
            //其中for of只在数组中使用
            //另一个枚举方法
            document.write(Object.values(z));
        </script>
</body>

</html>